<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:ui="http://java.sun.com/jsf/facelets">
<ui:composition template="/resources/plantillas/encuesta.xhtml">
    <ui:define name="content">
            <h:panelGrid>
                <h:outputText value="Con el fin de mejor la calidad de nuestros servicios, le solicitamos amablemente diligenciar la siguiente encuesta de satisfacción al cliente."/>
                <br/>
                <h:form>
                    <h:panelGrid columns="3">
                        <h:outputText style="font-weight: bold" value="Nombre:" />
                        <h:inputText id="fnombre" label="Nombre" value="#{EncuestaBean.encuestavo.nombre}" required="true" maxlength="50" size="30"/>
                        <h:message for="fnombre" style="color:red"/>
                        <h:outputText style="font-weight: bold" value="Email:" />
                        <h:inputText id="femail" label="Email" value="#{EncuestaBean.encuestavo.email}" required="true" validator="#{EncuestaBean.validarEmail}" maxlength="30" size="30"/>
                        <h:message for="femail" style="color:red"/>
                    </h:panelGrid>
                    <br/>
                    <h:panelGrid columns="2">
                        <h:outputText style="font-weight: bold" value="¿A través de qué medio fue atendida su solicitud?"/>
                        <br/>
                        <h:selectOneRadio id="fmedio" label="Medio" value="#{EncuestaBean.encuestavo.medio}" required="true">
                            <f:selectItem itemValue="Teléfono" itemLabel="Teléfono"/>
                            <f:selectItem itemValue="Correo electrónico" itemLabel="Correo electrónico"/>
                            <f:selectItem itemValue="Chat" itemLabel="Chat"/>
                        </h:selectOneRadio>
                        <h:message for="fmedio" style="color:red"/>
                    </h:panelGrid>
                    <br/>
                    <h:outputText style="font-weight: bold" value="Califique los siguientes aspectos:"/>
                    <h:panelGrid columns="2" style="text-align: left;">    
                        <h:outputText value="• Agilidad en la atención"/>
                        <h:selectOneRadio value="#{EncuestaBean.encuestavo.agilidad}" required="true">
                            <f:selectItem itemValue="Excelente" itemLabel="Excelente"/>
                            <f:selectItem itemValue="Bueno" itemLabel="Bueno"/>
                            <f:selectItem itemValue="Regular" itemLabel="Regular"/>
                            <f:selectItem itemValue="Malo" itemLabel="Malo"/>
                        </h:selectOneRadio>
                        <h:outputText value="• Información suministrada"/>
                        <h:selectOneRadio value="#{EncuestaBean.encuestavo.informacion}" required="true">
                            <f:selectItem itemValue="Excelente" itemLabel="Excelente"/>
                            <f:selectItem itemValue="Bueno" itemLabel="Bueno"/>
                            <f:selectItem itemValue="Regular" itemLabel="Regular"/>
                            <f:selectItem itemValue="Malo" itemLabel="Malo"/>
                        </h:selectOneRadio>
                        <h:outputText value="• Claridad en el lenguaje utilizado"/>
                        <h:selectOneRadio value="#{EncuestaBean.encuestavo.claridad}" required="true">
                            <f:selectItem itemValue="Excelente" itemLabel="Excelente"/>
                            <f:selectItem itemValue="Bueno" itemLabel="Bueno"/>
                            <f:selectItem itemValue="Regular" itemLabel="Regular"/>
                            <f:selectItem itemValue="Malo" itemLabel="Malo"/>
                        </h:selectOneRadio>
                    </h:panelGrid>
                    <br/>
                    <h:panelGrid>
                        <h:outputText style="font-weight: bold" value="Cuál fue su nivel de satisfacción general con nuestro servicio de Atención al Cliente:"/>
                        <h:selectOneRadio value="#{EncuestaBean.encuestavo.satisfaccion}" required="true">
                            <f:selectItem itemValue="Completamente satisfecho" itemLabel="Completamente satisfecho"/>
                            <f:selectItem itemValue="Satisfecho" itemLabel="Satisfecho"/>
                            <f:selectItem itemValue="Insatisfecho" itemLabel="Insatisfecho"/>
                            <f:selectItem itemValue="Completamente insatisfecho" itemLabel="Completamente insatisfecho"/>
                        </h:selectOneRadio>
                    </h:panelGrid>
                    <br/>
                    <h:panelGrid>
                        <h:panelGrid columns="2">
                            <h:outputText style="font-weight: bold" value="Observaciones"/>
                            <h:message for="comentarios" style="color:red"/>
                        </h:panelGrid>
                        <h:inputTextarea id="comentarios" value ="#{EncuestaBean.encuestavo.observaciones}" rows="5" cols="75" validator="#{EncuestaBean.validarComentarios}"/>
                    </h:panelGrid>
                    <h:panelGrid style="font-size: 10px;text-align:center" width="100%">
                        <h:commandButton value="Enviar" action="#{EncuestaBean.responder}" />
                        <h:inputHidden value="#{EncuestaBean.radicado}" />
                    </h:panelGrid>
                </h:form>
            </h:panelGrid>
    </ui:define>
</ui:composition>
</html>